<template>
  <div class="page">
    <goods :item="item"></goods>
    <div class="group">
      <van-cell
        :title="`${item.numberOfMember}人成团`"
        :label="`开团${item.duration}小时后自动结束`"
        status="12:12:12"
      >
        <van-button type="primary" size="small" @click="openGroup">我要开团</van-button>
      </van-cell>
    </div>
    <div class="group">
      <van-panel title="拼团须知">
        <div class="content">
          <p>1. 就爱看的南方喀京东方阿斯蒂芬阿道夫</p>
          <p>2. 就爱看的南方喀京东方阿斯蒂芬阿道夫是考虑对方设计风格</p>
          <p>3. 就爱看的南方喀京东方阿斯蒂芬阿道夫是考虑对方设计风格 发的该死的风格是大法官双方各</p>
        </div>
      </van-panel>
    </div>
    <sku ref="sku" :item="item" :type="type" @buy="buy"></sku>
  </div>
</template>

<script>
import Tabbar from '@/components/Tabbar.vue'
import Goods from '@/components/Goods.vue'
import Sku from '@/components/Sku.vue'
import mixin from '@/mixin'
import { postPurchase } from '@/api'

export default {
  name: 'open-group',
  mixins: [mixin],
  components: {
    Tabbar,
    Goods,
    Sku
  },
  data() {
    return {
      timer: null,
      item: this.$store.state.currentGoods,
      type: 'openGroup'
    }
  },
  created() {
    console.log(this.item)
  },
  methods: {
    openGroup() {
      this.$refs.sku.buy()
    },
    buy(data) {
      postPurchase(data).then(res => {
        console.log(res)
        this.$toast('模拟提交')
        this.$router.go(-1)
      })
    }
  }
}
</script>
<style scoped lang="stylus" rel="stylesheet/stylus">
@import '../style/mixin'
.group
  margin-top $part-width
.content
  box-sizing border-box
  padding 15px
  font-size 14px
  color #555555
  line-height 24px
  p
    margin-bottom 8px
  img 
    width 100%
    margin-bottom 10px
img.icon
  width 44px
  height 44px
  margin-right 10px
.price
  font-weight bold
  color #ff0000
</style>
